<template>
    <div  class="tab-pane active">
    <div class="panel-body">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title" style="  border-width: 0px;">
                        <h5>音频列表 </h5>

                        <div class="ibox-tools">
                            <span class="text-danger">上传音频大小请不要超过4M, 长度不超过 60 秒，不可含有敏感内容，如色情，商品推广，虚假信息等! &nbsp;&nbsp;&nbsp;&nbsp;</span>

                            <button class="btn btn-primary btn-xs" v-on:click="showImportDialog()">
                                上传音频
                            </button>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <el-list :stateManager="stateManager"></el-list>
                    </div>
                </div>
            </div>
        </div>
    </div>
        <el-import :stateManager="stateManager"></el-import>
        <el-dialog :stateManager="stateManager"></el-dialog>
        <confirm-modal v-if="stateManager.deleteDialogVisible" text="你确定要删除此项内容吗？" title="删除确认"
                       v-on:cancel="stateManager.deleteDialogVisible= false"  v-on:ok="deleteModel"
        ></confirm-modal>
    </div>
</template>
<script>
    import table from './_table.vue';
    import im_dialog from './_import.vue';
    import dialog from './_dialog.vue';
    export default {
        components: {
            'el-dialog': dialog,
            'el-list': table,
            'el-import':im_dialog,
//            'el-see':see,
//            'el-statistics':statistics
        },
        data: function () {
            return {
//                departments: [{label: '综合部', value: 1}, {label: '技术部', value: 2}, {label: '行政部', value: 3}],
                stateManager: {
                    refreshList: true,
                    SeeDialogVisible: false,
                    SeeModelId: 0,
                    ImportDialogVisible: false,
                    editDialogVisible: false,
                    editModelId: 0,
                    deleteDialogVisible: false,
                    deleteModelId: 0,
                },
                link:'',
                model: this.$modelDataSource({
                    url: 'api/WeChat/WeChatVoice',
                    dataKey: 'model',
                    attributes: {
                        id: 0,
                    }
                })
            };
        },
        methods: {
            showImportDialog: function () {
                this.stateManager.ImportDialogVisible = true;
            },
            deleteModel: function () {
                this.stateManager.deleteDialogVisible = false;
                let self = this;
                self.model.id = this.stateManager.deleteModelId;
                self.model.destroy(function () {
                    self.model.reset();
                    self.stateManager.refreshList = true;
                    toastr.success('删除成功！');
                }, function () {
                    if (self.model.errors.permissions_errors) {
                        toastr.error(self.model.errors.permissions_errors);
                    }
                });
            }
        },
    }
</script>